<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			$(function(){
				
				$("#li1").click(function(){
						
					$("#ul1").children("#shuiguo").toggle(500)
					
				});
				$("#li2").click(function(){
					$("#ul2").children("#pu").toggle(500)
				})
				
				
			});
		</script>
	</head>
	<body>
		<ul id="ul1">
			<li id="li1">水果</li>
			<ul id="shuiguo">
				    <li id="li2">葡萄</li>
				      <ul id="ul2">
				      	<a id="pu">
					   <li>绿葡萄</li>
					   <li>黑葡萄</li>
					   </a>
				      </ul>
				      
				
			</ul>
			
		</ul>
	</body>
</html>
